.sidebar-btn{
  background-color: transparent;
  border: none;
  outline: none;
}

.sidebar-img{
  max-width: 100%;
  border-radius: 10px;
  margin-top: 10px;
  cursor: pointer;
  -webkit-transition: all 400ms;
  -moz-transition: all 400ms;
  -ms-transition: all 400ms;
  -o-transition: all 400ms;
  transition: all 400ms;
  border: 4px solid transparent;
}

.btn-hover:hover{
  border-color: rgba(0, 187, 255, 0.5);
  -webkit-transition: all 400ms;
  -moz-transition: all 400ms;
  -ms-transition: all 400ms;
  -o-transition: all 400ms;
  transition: all 400ms;
}

.active{
  border-color: #00bbff;
}

.dot-row{
  display: flex;
  justify-content: center;
  margin: 20px 0 40px 0;
}

.dot{
  border: 3px solid transparent;
  border-radius: 50%;
  width: 23px;
  height: 23px;
  margin: 0 10px;
  cursor: pointer;
}

.purple{
  background-color: #9c27b0;
}

.blue{
  background-color: #00bcd4;
}

.dodgerblue{
  background-color: dodgerblue;
}

.green{
  background-color: #4caf50;
}

.orange{
  background-color: #ff9800;
}

.red{
  background-color: #f44336;
}

.white{
  background-color: rgba(200, 200, 200, 0.2);
}

.rose{
  background-color: #e91e63;
}

.black{
  background-color: #000;
}
